<template>
  <TableSearch
    v-loading="loading"
    ref="tableSearch"
    :tableBtns="tableBtns"
    :search-path="searchPath"
    :formItemsInline="formItemsInline"
    :columns="columns"
    :tableData="tableData"
    :form="form"
    @handleTableData="handleTableData"
    @reset="reset"
  >
    <template slot="date">
      <el-form-item>
        <SearchDatePicker
          :start.sync="form.startTime"
          :end.sync="form.endTime"
          :disable-date="{
            range: 31 * 24 * 3600 * 1000,
          }"
        />
      </el-form-item>
    </template>
  </TableSearch>
</template>
<script>
import TableSearch from '@/components/TableSearch'
import { paymentbillList, exportTransationList } from '@/api/transation'
import dayjs from 'dayjs'

const billType = {
  RECHARGEBILL: '充值订单',
  CONSUMBILL: '后付费充电订单',
  FREEBILL: '赠送订单',
  MONTHLYCARDBILL: '套餐订单',
  PREPAYMENT: '预付费充电订单',
  TIMECARDBILL: '时长卡订单',
  ENERGYBILL: '和能量订单',
}

const paymentType = {
  WEIXIN_GZH: '微信公众号',
  WEIXIN_APP: '微信APP',
  ALIPAY_APP: '支付宝APP',
  UNIONPAY: '银联支付',
  WEIXIN_MP: '微信小程序',
  UNIONPAY_WEIXIN_APP: '银联-微信APP',
  UNIONPAY_WEIXIN_GZH: '银联-微信公众号',
  UNIONPAY_WEIXIN_MP: '银联-微信小程序',
  ORDINARY_WEIXIN_GZH: '普通商户-微信公众号',
  ORDINARY_WEIXIN_APP: '普通商户-微信APP',
  ORDINARY_WEIXIN_MP: '普通商户-微信小程序',
  ALIPAY_MP: '支付宝小程序',
  SMS_PAY: '话费支付',
}

const queryPaymentType = {
  WEIXIN_MP: '微信小程序',
  ALIPAY_MP: '支付宝小程序',
  SMS_PAY: '话费支付',
}

export default {
  name: 'TransationList',
  components: { TableSearch },
  data() {
    return {
      form: {
        startTime: new Date().valueOf() - 30 * 24 * 3600 * 1000,
        endTime: new Date().valueOf(),
      },
      visible: false,
      loading: false,
      tableData: {},
      columns: [
        {
          label: '交易号',
          prop: 'paymentBillNum',
          resourceId: '/web/fund-management/paymentbill-management/交易号',
        },
        {
          label: '用户手机号码',
          prop: 'userMobile',
          resourceId:
            '/web/fund-management/paymentbill-management/用户手机号码',
        },
        {
          label: '交易时间',
          prop: 'paymentTime',
          formatter: (row) => {
            if (row.paymentTime) {
              return dayjs(row.paymentTime).format('YYYY-MM-DD HH:mm:ss')
            }

            return '--'
          },
          resourceId: '/web/fund-management/paymentbill-management/交易时间',
        },
        {
          label: '端口',
          prop: 'pgnum',
          resourceId: '/web/fund-management/paymentbill-management/端口',
        },
        {
          label: '交易金额',
          prop: 'totalMoney', //
          resourceId: '/web/fund-management/paymentbill-management/交易金额',
        },
        {
          label: '支付渠道',
          prop: 'paymentType',
          formatter: (item) => {
            return paymentType[item.paymentType]
          },
          resourceId: '/web/fund-management/paymentbill-management/支付渠道',
        },
        {
          label: '交易类型',
          prop: 'billType',
          formatter: (item) => {
            return billType[item.billType] || ''
          },
          resourceId: '/web/fund-management/paymentbill-management/交易类型',
        },
        {
          label: '收款方',
          prop: 'mchName',
          resourceId: '/web/fund-management/paymentbill-management/收款方',
        },
        {
          label: '是否退款',
          prop: 'refund',
          formatter: (item) => {
            if (item.refund) return '是'
            return '否'
          },
          resourceId: '/web/fund-management/paymentbill-management/是否退款',
        },
        {
          label: '退款金额',
          prop: 'refundFee',
          formatter: (item) => {
            if (item.refundFee) return `${item.refundFee}元`
            return '0元'
          },
          resourceId: '/web/fund-management/paymentbill-management/退款金额',
        },
        {
          label: '是否异常退费',
          prop: 'exRefund',
          formatter: (item) => {
            if (item.exRefund) return '是'
            return '--'
          },
          resourceId:
            '/web/fund-management/paymentbill-management/是否异常退费',
        },
        {
          label: '操作',
          resourceId: '/web/fund-management/paymentbill-management/操作',
          buttons: [
            {
              label: '详情',
              class: 'table-button-green',
              size: 'small',
              resourceId:
                '/web/fund-management/paymentbill-management/查看详情',
              click: this.handleOpenDesc,
            },
          ],
        },
      ],
      tableBtns: [
        {
          label: '导出',
          isExport: true,
          startDownload: (callback) => {
            exportTransationList({
              ...this.form,
              pageSize: 10,
              currentPage: 1,
            })
              .then((res) => {
                callback(res)
              })
              .catch((err) => {
                console.log(err)
                callback(0)
              })
          },
          resourceId: '/web/fund-management/paymentbill-management/导出',
        },
      ],
      searchPath: '/web/fund-management/paymentbill-management/查询',
      formItemsInline: [
        {
          type: 'text',
          value: 'paymentBillNum',
          placeholder: '交易号',
          clearable: true,
          resourceId: '/web/fund-management/paymentbill-management/交易号',
        },
        {
          type: 'text',
          value: 'userMobile',
          placeholder: '用户手机号',
          clearable: true,
          resourceId:
            '/web/fund-management/paymentbill-management/用户手机号码',
        },
        {
          slot: 'date',
        },
        {
          type: 'text',
          value: 'mchName',
          placeholder: '代理商',
          clearable: true,
          resourceId: '/web/fund-management/paymentbill-management/收款方',
        },
        {
          type: 'select',
          value: 'paymentType',
          options: () => {
            return Object.keys(queryPaymentType).map((item) => {
              return {
                label: queryPaymentType[item],
                value: item,
              }
            })
          },
          placeholder: '-支付渠道-',
          clearable: true,
          resourceId: '/web/fund-management/paymentbill-management/支付渠道',
        },
        {
          type: 'select',
          value: 'refund',
          options: [
            {
              label: '是',
              value: 1,
            },
            {
              label: '否',
              value: 0,
            },
          ],
          placeholder: '-是否退款-',
          clearable: true,
          resourceId: '/web/fund-management/paymentbill-management/是否退款',
        },
        {
          type: 'select',
          value: 'billType',
          options: () => {
            return Object.keys(billType).map((item) => {
              return {
                label: billType[item],
                value: item,
              }
            })
          },
          placeholder: '-交易类型-',
          clearable: true,
          resourceId: '/web/fund-management/paymentbill-management/交易类型',
        },
        {
          type: 'select',
          value: 'exrefund',
          options: [
            {
              label: '是',
              value: 1,
            },
            {
              label: '否',
              value: 0,
            },
          ],
          placeholder: '-异常退费-',
          clearable: true,
          resourceId:
            '/web/fund-management/paymentbill-management/是否异常退费',
        },
      ],
    }
  },
  methods: {
    handleTableData(params) {
      this.loading = true
      paymentbillList(params)
        .then((res) => {
          this.tableData = {
            list: res.list,
            totalCount: res.totalAmount,
          }
        })
        .catch((err) => {
          console.log(err)
        })
        .finally(() => {
          this.loading = false
        })
    },
    reset() {
      this.form = {
        startTime: new Date().valueOf() - 30 * 24 * 3600 * 1000,
        endTime: new Date().valueOf(),
      }
    },
    handleOpenDesc(row) {
      this.$router.push(`/transation/detail/${row.paymentBillNum}`)
    },
  },
}
</script>
